﻿import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQuick.Window 2.15
//import com.yourcompany.ethernettest 1.0

Window {
    id: ethrnetPage
    visible: true
    width: 1200
    height: 768
    minimumWidth: 1200 // 设置最小宽度
    minimumHeight: 768 // 设置最小高度
    title: "Ethernet Test"

    property string ethmetMode: "tcp"
    property int ethmetTestMode: -1   // 0 ping 1 速率测试1

    Connections {
        target: ethernet

        function onMessageReceived(message) {
            if(0 == ethmetTestMode)
                dataDisplay.append("Message received: " + message)
            else if(1 == ethmetTestMode)
                dataDisplayContinues.append("Test Result: Message Received: " + message)
        }

        function onConnectionEstablished() {
            if(0 == ethmetTestMode)
                dataDisplay.append("Connection established")
            else if(1 == ethmetTestMode)
                dataDisplayContinues.append("Test Result: Connection Established")
        }

        function onConnectionError(error) {
            if(0 == ethmetTestMode)
                dataDisplay.append("Connection error: " + error)
            else if(1 == ethmetTestMode)
                dataDisplayContinues.append("Test Result: Connection Error: " + error)
        }

        function onPingReply(reply) {
            if(0 == ethmetTestMode)
                dataDisplay.append(reply)
            else if(1 == ethmetTestMode)
                dataDisplayContinues.append("Test Result: Ping Reply: " + reply)
        }


        function onSpeedTestResult(sentMbps, receivedMbps) {
             dataDisplayContinues.append("Test Result: Sent Speed: " + sentMbps.toFixed(2) + " Mbps, Received Speed: " +
                                         receivedMbps.toFixed(2) + " Mbps")
            stopButton.enabled = false
            startButton.enabled = true
        }
    }

    RowLayout {
        id: ethernetRow
        anchors.fill : parent

        // 左侧区域
        Rectangle {
            id:ethernetleft
            width: ethernetRow.width * 0.38
            height: ethernetRow.height * 0.99
            anchors.top: ethernetRow.top
            anchors.topMargin: 5
            anchors.left: parent.left
            anchors.leftMargin: 5
            border.color: "#c0c0c0"     // 边框颜色
            border.width: 2             // 边框宽度

            color: "#f0f0f0"

            // 第一个框
            Rectangle {
                id: ethernetSetup
                width: ethernetleft.width * 0.98
                height: ethernetleft.height * 0.25
                anchors.top: ethernetleft.top
                anchors.topMargin: 4
                anchors.left: ethernetleft.left
                anchors.leftMargin: 3

                ColumnLayout {
                    anchors.centerIn: parent
                    spacing: 10

                    RowLayout {
                        id: ethernetDestIP
                        //anchors.fill: parent
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetleft.top
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetDestIPText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "目标机IP   :"
                        }

                        TextField {
                            id: ethernetDestIPInput
                            width: ethernetleft.width * 0.25
                            text: "30.119.81.110"
                            placeholderText: "30.119.81.110"
                        }
                    }
                    /*
                    RowLayout {
                        id: ethernetDestPort
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestIP.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetDestPortText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "目标机端口 :"
                        }

                        TextField {
                            id: ethernetDestPortInput
                            width: ethernetleft.width * 0.25
                            placeholderText: "22"
                        }
                    }*/
                    /*
                    RowLayout {
                        id: ethernetLocalIP
                        //anchors.fill: parent
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestPort.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetLocalIPText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "本机IP     :"
                        }

                        TextField {
                            id: ethernetLocalIPInput
                            width: ethernetleft.width * 0.25
                            placeholderText: "192.168.1.1"
                        }
                    }

                    RowLayout {
                        id: ethernetLocalPort
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetLocalIP.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetLocalPortText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "本机端口   :"
                        }

                        TextField {
                            id: ethernetLocalPortInput
                            width: ethernetleft.width * 0.25
                            placeholderText: "22"
                        }
                    }*/

                    RowLayout {
                        id: pingButton
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestIP.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Button {
                            text: "Ping"
                            onClicked: {
                                ethmetTestMode = 0
                                ethernet.pingHost(ethernetDestIPInput.text)
                                //ethernet.startPing(ethernetDestIPInput.text)
                            }
                        }
                    }

                    RowLayout {
                        id: keepAliveRow
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: pingButton.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                    }
                }
            }

            // 左侧第二个框
            Rectangle {
                id: ethernetStatus
                width: ethernetleft.width * 0.98
                height: ethernetleft.height * 0.734
                anchors.top: ethernetSetup.bottom
                anchors.topMargin: 4
                anchors.left: ethernetleft.left
                anchors.leftMargin: 3

                ColumnLayout {
                    // 会从中心开始布局
                    anchors.centerIn: parent
                    spacing: 5

                    /*
                    id: protocolInput
                    model: ["TCP", "UDP"]
                    //placeholderText: "Select protocol"
                    }*/

                    RowLayout {
                        id: ethernetDestIP1
                        //anchors.fill: parent
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetStatus.top
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetDestIPText1
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "目标机IP   :"
                        }

                        TextField {
                            id: ethernetDestIPInput1
                            width: ethernetleft.width * 0.25
                            text: ethernetDestIPInput.text
                            placeholderText: "30.119.81.110"
                        }
                    }
                    /*
                    RowLayout {
                        id: ethernetDestPort1
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestIP.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: ethernetDestPortText1
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "目标机端口 :"
                        }

                        TextField {
                            id: ethernetDestPortInput1
                            width: ethernetleft.width * 0.25
                            placeholderText: "22"
                        }
                    }*/

                    RowLayout {
                        id: ethernetDestPortSet
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestIP1.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: ethernetDestPortText2
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "目标机端口 :"
                        }

                        SpinBox {
                            id: portSpinBox
                            Layout.fillWidth: true
                            from: 1
                            to: 65535
                            value: 8080
                            //placeholderText: "Enter Port Number"
                        }
                    }

                    RowLayout {
                        id: dataMaxLength
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestPortSet.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataMaxLengthText
                            width: ethernetleft.width * 0.15
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "发送包最大尺寸:"
                        }


                        TextField {
                            id: dataMaxLengthInput
                            width: ethernetleft.width * 0.10
                            anchors.right: ethernetleft.right
                            anchors.rightMargin: 15
                            placeholderText: "64"
                        }
                    }

                    RowLayout {
                        id: dataSendTime
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: dataMaxLength.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataSendTimeText
                            width: ethernetleft.width * 0.15
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "发送包时间:"
                        }

                        Slider {
                            id: durationSlider
                            Layout.fillWidth: true
                            from: 1
                            to: 180
                            value: 10
                            stepSize: 1
                            onValueChanged: dataSendDurationText.text = "发送持续时间: " + value + " seconds"
                        }
                    }


                    RowLayout {
                        id: dataSendDuration
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: dataSendTime.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataSendDurationText
                            width: dataSendDuration.width
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "发送持续时间"
                        }
                    }

                    /*
                    RowLayout {
                        id: dataSendTime
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetDestPortSet.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataSendTimeText
                            width: ethernetleft.width * 0.15
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "发送包时间:"
                        }

                        Label {
                            id: durationLabel
                            text: "Duration: " + durationSlider.value + " seconds"
                        }
                    }*/

                    RowLayout {
                        id: selectFormat
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.1
                        anchors.top: dataSendDuration.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        // 使用 RadioButton
                        RadioButton {
                            id: receiverTCP
                            text: "TCP"
                            width: 5
                            height: 5
                            checked: true
                            onCheckedChanged: {
                                if (checked) {
                                    console.log("接收设置： TCP")
                                    ethmetMode = "TCP"
                                }
                            }
                        }


                        RadioButton {
                            id: receiverUDP
                            text: "UDP"
                            width: 5
                            height: 5
                            onCheckedChanged: {
                                if (checked) {
                                    console.log("接收设置： UDP")
                                    ethmetMode = "UDP"
                                }
                            }
                        }

                        RadioButton {
                            id: keepAlive
                            text: "保持连接"
                            width : 5
                            height: 5
                            onCheckedChanged: {
                                if (checked) {
                                    console.log("保持连接")
                                }
                            }
                        }
                    }

                    RowLayout {
                        id: tcpUdpStatus
                        width: ethernetleft.width * 1
                        height: ethernetleft.height * 0.15
                        anchors.top: selectFormat.bottom
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 15

                        Text {
                            id: tcpStatusText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "TCP状态 :"
                        }

                        // TCP 连接状态绿色为连接成功，否则为红色，未连接未灰色
                        Rectangle {
                            id: tcpStatus
                            width : 20
                            height: 20
                            radius: width / 2
                            color: "gray"
                        }

                        Text {
                            id: udpStatusText
                            width: ethernetleft.width * 0.2
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "UDP状态 :"
                        }

                        // UDP 连接状态绿色为连接成功，否则为红色，未连接未灰色
                        Rectangle {
                            id: udpStatus
                            width : 20
                            height: 20
                            radius: width / 2
                            color: "gray"
                        }
                    }

                    /*
                    RowLayout {
                        id: dataInvent
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        anchors.top: ethernetStatus.top
                        anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataInventText
                            width: ethernetleft.width * 0.15
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "发送包间隔    :"
                        }


                        TextField {
                            id: dataInventInput
                            width: ethernetleft.width * 0.10
                            anchors.right: ethernetleft.right
                            anchors.rightMargin: 15
                            placeholderText: "64"
                        }
                    }

                    RowLayout {
                        id: dataOverTime
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        //anchors.top: ethernetStatus.top
                        //anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 2

                        Text {
                            id: dataOverTimeText
                            width: ethernetleft.width * 0.15
                            anchors.left: ethernetleft.left
                            anchors.leftMargin: 5
                            text: "超时时间      :"
                        }


                        TextField {
                            id: dataOverTimeInput
                            width: ethernetleft.width * 0.10
                            anchors.right: ethernetleft.right
                            anchors.rightMargin: 15
                            placeholderText: "64"
                        }
                    }*/

                    RowLayout {
                        id: connectButton
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        //anchors.top: ethernetStatus.top
                        //anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 10

                        Button {
                            id: startButton
                            text: "连接"
                            onClicked: {
                                ethmetTestMode = 1
                                var host = ethernetDestIPInput1.text
                                //var port = ethernetDestPortInput.text
                                //var protocol = protocolInput.currentText
                                //console.log("接收设置： " ,protocol)
                                //ethernet.connectToHost(ethmetMode, host, parseInt(port))
                                //ethernet.connectToHost(protocol, host, parseInt(port))
                                ethernet.startSpeedTest(ethmetMode, host, portSpinBox.value, durationSlider.value)
                            }
                        }

                        Button {
                            id: stopButton
                            text: "停止"
                            onClicked: {
                                 ethernet.stopSpeedTest()
                                //var message = "Hello"
                                //ethernet.sendMessage(message)
                            }
                        }
                    }

                    /*
                    RowLayout {
                        id: sendButton
                        //anchors.fill: parent
                        width: ethernetleft.width * 0.5
                        height: ethernetleft.height * 0.1
                        //anchors.top: ethernetStatus.top
                        //anchors.topMargin: 5
                        anchors.left: ethernetleft.left
                        anchors.leftMargin: 5
                        spacing: 10

                        Button {
                            text: "断开"
                            onClicked: {
                                //ethernet.disconnectFromHost()
                                 ethernet.stopSpeedTest()
                            }
                        }
                    }*/

                    /*
                    Label {
                        id: resultLabel
                        text: "Test Result: "
                    }*/
                }
            }

        }

        // 右侧区域，设置数据发送、接收以及错误信息显示
        Rectangle {
            id: ethernetDisplay
            width : ethernetRow.width  * 0.60
            height: ethernetRow.height * 0.99
            anchors.right: ethernetRow.right
            anchors.rightMargin: 10
            color: "#f0f0f0"


            ColumnLayout {
                id: dataReceiceColumn
                spacing: 10

                Rectangle {
                    id:dataRecevice
                    width: ethernetDisplay.width
                    height: ethernetDisplay.height * 0.50

                    Label {
                        id:  dataReceviceLabel
                        anchors.top: dataRecevice.top
                        anchors.topMargin: 15
                        text: "接收数据"
                    }

                    Button {
                        id: ethernetExitButton
                        text: "返 回"
                        width: dataRecevice.width * 0.10
                        height: dataRecevice.height * 0.08
                        anchors.right: dataRecevice.right
                        anchors.rightMargin: 5
                        anchors.top: dataRecevice.top
                        //anchors.topMargin: 5
                        onClicked: {
                            console.log("返回主界面")
                            ethrnetPage.visible = false
                            mainPage.visible = true
                        }
                    }

                    Rectangle {
                        id: ethernetDisplayArea
                        width: parent.width * 1  // 设置宽度为父容器的 90%
                        height: parent.height * 0.8 // 设置高度为父容器的 50%
                        color: "#f0f0f0"            // 背景颜色（可根据需要更改）
                        border.color: "#c0c0c0"     // 边框颜色
                        border.width: 2             // 边框宽度
                        //radius: 10                  // 圆角，值越大圆角越明显
                        anchors.top: ethernetExitButton.bottom
                        anchors.topMargin: 3        // 使其与标签之间有一定的间距

                        // 使用ScrollView包裹TextArea来实现滚动效果
                        ScrollView {
                            anchors.fill: parent
                            clip: true

                            // 内部的TextArea组件
                            TextArea {
                                id: dataDisplay
                                width: parent.width    // 宽度占背景框的 90%
                                height: parent.height  // 这里设置为动态高度，根据内容自适应，让滚动条能正确反映内容多少
                                anchors.fill: parent   // 填充整个ScrollView
                                readOnly: true             // 使其只读，不可编辑
                                placeholderText: "接收到的数据"
                                color: "black"            // 设置字体颜色为黑色
                                background: Rectangle {
                                    color: "transparent"  // 背景透明，显示父元素的颜色
                                }
                                //text: ethernet.pingResult
                                wrapMode: TextArea.Wrap       // 自动换行
                                font.pixelSize: 14            // 字体大小（可以根据需要调整）
                            }
                        }
                    }

                    Rectangle {
                        id: ethernetRightButton
                        width: ethernetDisplay.width * 1 // 宽度占背景框的 90%
                        height: parent.height * 0.8 // 高度占背景框的 80%
                        anchors.top: ethernetDisplayArea.bottom
                        anchors.topMargin: 5
                        // 清除数据按钮
                        RowLayout {
                            id: ethernetRightButtonRow


                            Button {
                                id: ethernetsendDatabutton
                                text: "发 送"
                                //anchors.top: sendserialbuttons.top
                                //anchors.left: sendserialbuttons.left

                                onClicked: {

                                }
                            }

                            Button {
                                id: ethernetclearDatabutton
                                text: "清 除"
                                anchors.left: ethernetsendDatabutton.right
                                anchors.leftMargin: 10

                                onClicked: {
                                    dataDisplay.clear()
                                }
                            }
                        }
                    }
                }

                Rectangle{
                    id:dataReceviceContinues
                    width: ethernetDisplay.width
                    height: ethernetDisplay.height * 0.50
                    anchors.top: dataRecevice.bottom
                    anchors.topMargin: 5


                    Label {
                        id:  dataReceviceLabel2
                        text: "接收数据"
                    }

                    // 数据接收显示
                    Rectangle {
                        id: ethernetDisplayAreaContinues
                        anchors.top: dataReceviceLabel2.bottom
                        anchors.topMargin: 2
                        width: parent.width * 1.0  // 设置宽度为父容器的 90%
                        height: parent.height * 0.82 // 设置高度为父容器的 50%
                        color: "#f0f0f0"            // 背景颜色（可根据需要更改）
                        border.color: "#c0c0c0"     // 边框颜色
                        border.width: 2             // 边框宽度

                        ScrollView {
                            anchors.fill: parent    // 让 ScrollView 填充整个 Rectangle
                            clip: true              // 防止内容溢出 ScrollView 的边界

                            // 包含一个文本框来显示接收到的数据
                            TextArea {
                                id: dataDisplayContinues
                                anchors.fill: parent // 让 TextArea 填充整个 ScrollView
                                readOnly: true       // 使其只读，不可编辑
                                placeholderText: "接收到的数据"
                                color: "black"       // 设置字体颜色为黑色
                                background: Rectangle {
                                    color: "transparent" // 背景透明，显示父元素的颜色
                                }
                                wrapMode: TextArea.Wrap // 自动换行
                                font.pixelSize: 14      // 字体大小（可以根据需要调整）
                            }
                        }
                    }

                    Rectangle {
                        id: ethernetRightButtonContinues
                        width: dataDisplayContinues.width * 1 // 宽度占背景框的 90%
                        height: parent.height * 0.8 // 高度占背景框的 80%
                        anchors.top: ethernetDisplayAreaContinues.bottom
                        anchors.topMargin: 5
                        // 清除数据按钮
                        RowLayout {
                            id: ethernetRightButtonRowContinues


                            Button {
                                id: ethernetsendDatabuttonContinues
                                text: "发 送"
                                //anchors.top: sendserialbuttons.top
                                //anchors.left: sendserialbuttons.left
//
                                onClicked: {

                                }
                            }

                            Button {
                                id: ethernetclearDatabuttonContinues
                                text: "清 除"
                                anchors.left: ethernetsendDatabutton.right
                                anchors.leftMargin: 10

                                onClicked: {
                                    dataDisplayContinues.clear()
                                }
                            }
                        }
                    }
                }
            }
        }
        /*
        // 错误信息显示
        Text {
            id: errorDisplay
            color: "red"
            anchors.top: ethernetleft.bottom
            anchors.topMargin: 10
            anchors.left: ethernetleft.left
            anchors.leftMargin: 10
        }*/
    }
}
